
.justify-center {
    display: flex;
    justify-content: center;
}

.justify-end {
    display: flex;
    justify-content: flex-end;
}

.justify-start {
    display: flex;
    justify-content: flex-start;
}

.justify-align-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.space-between {
    display: flex;
    justify-content: space-between;
}

.space-around {
    display: flex;
    justify-content: space-around;
}

/*display上下布局*/
.align-center {
    display: flex;
    align-items: center;
}

.align-end {
    display: flex;
    align-items: flex-end;
}


.hundred-width {
    width: 900px;
    /*border: 1px solid red;*/
}

.text-align {
    text-align: center;
}

.text-right {
    text-align: right;
}

.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}

.read-more {
    color: rgb(243, 101, 37);
    font-size: 15px;

}

.service-good {
    font-size: 20px;
}

.padding-ten {
    padding: 10px;
}

.border-gray {
    border: 1px solid gray;
}

/*单行溢出*/
.single-over {
    /*超过的要隐藏*/
    overflow: hidden;
    /*不换行*/
    white-space: nowrap;
    /*多余的用...表示*/
    text-overflow: ellipsis;
}

/*多行溢出*/
.many-over-two {
    /*前两行固定用法*/
    display: -webkit-box;
    -webkit-box-orient: vertical;
    /*多余的...表示*/
    text-overflow: ellipsis;
    /*最多显示两行*/
    -webkit-line-clamp: 2;
    /*多余的隐藏*/
    overflow: hidden;
}

/*多行溢出*/
.many-over-three {
    /*前两行固定用法*/
    display: -webkit-box;
    -webkit-box-orient: vertical;
    /*多余的...表示*/
    text-overflow: ellipsis;
    /*最多显示两行*/
    -webkit-line-clamp: 3;
    /*多余的隐藏*/
    overflow: hidden;
}

.bana {
    margin: 10px 0;
}